<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>微信官网</title>
</head>
    <style>
        *{
            padding: 0px;
            margin: 0px;
            list-style: none;
        }
        .a1{
            height: 499px;
            background:url('images/bg.jpg');
            margin: 0px auto;
        }
        .a2{
            width: 954px;
            height: 75px;
            margin: 0px auto;
        }
        .a2 img{
            margin: 14px 0px;
            float: left;
        }
        .a2 ul{
            float:left;
            margin: 0px 46px;
           
        }
        .a2 li{
            float: left;
            padding: 11px 11px;
            margin-top: 20px;
            font-size: 14px;
            cursor:pointer;
            
        }
        .a2 a{
            color: white;
            text-decoration: none;
            
        }
        .a2 li:hover{
            border-radius: 20px;
            background:linear-gradient(#3b1b1a,#090909);
            
        }
        .b1{
            width: 967px;
            margin: 55px auto;
        }
        .b1 a{
            text-decoration: none;
            cursor:pointer;
        }
        .b1 h1 a{
            color: black;
        }
        .b1 h4{
            margin: 16px 0px;
        }
        .b1 h4 a{
            color: #979797;
        }
        .b1 .l1{
            line-height: 1.8;
            font-size: 14px; 
        }
        .b1 .l1 a{
            color: #609700;
        }
        .l1:hover{
            text-decoration: underline;
        }
        .b2{
            float: left;
        }
        .b3 img{
            margin: 0px 69px;
        }
        .c1{
            width: 967px;
            height: 340px;
            margin: 48px auto 0px;
            border-bottom: 1px solid  #979797;
        }
        .c2{
            width: 630px;
            float:left;
        }
        .c2 img{
            float: left;
        }
        .u1,.u2,.u3{
            font-size: 14px;
            float:left;
        }
        .u1,.u2,.u3, h2{
            font-size: 14px;
        }
        .u1{
            margin-top: 11px;
        }
        .u2{
            margin:11px 67px;
        }
        .u3{
            margin: 11px 25px;
        }

        .c2 .z1{
            color: #979797;
            margin: 0.33em 0px;
        }
        .z2 a{
            text-decoration: none;
            color: #609700;
        }
        .c3{
            width: 330px;
            float: left;
            margin: -213px 658px;
        }
        .c3 a{
           font-size: 14px;
           color: #609700;
           text-decoration: none;
            cursor:pointer;
            line-height: 1.8;
        }
        .c3 a:hover{
            text-decoration: underline;
        }
        .c3 ul{
            float: left;
        }
        .c4{
            width: 967px;
            margin: 0px auto;
            
        }
        .u5{
            float: left;
        }
        .u5 .l4{
            float: left;
        }
        .u5.l5{
            float: left;
        }
        .u4{
            float: right;
        }
        .u4 .l3{
            float: left;
        }
        .u4 a{
            color: #979797;
            text-decoration: none;
            cursor:pointer;
            font-size: 14px;
        }
        .u5 a{
            color: #979797;
            text-decoration: none;
            cursor:pointer;
            font-size: 14px;
        }
    </style>
    <body>
        <div class="a1">
            <div class="a2">
                <a href=""><img src="images/log.png" alt="" width="126px"></a>
                <ul>
                    <li><a href=""><span>首页</span></a></li>
                    <li><a href=""><span>帮助与反馈</span></a></li>
                    <li><a href=""><span>公众平台</span></a></li>
                    <li><a href=""><span>开放平台</span></a></li>
                    <li><a href=""><span>微信支付</span></a></li>
                    <li><a href=""><span>微信广告</span></a></li>
                    <li><a href=""><span>企业微信</span></a></li>
                    <li><a href=""><span>表情开放平台</span></a></li>
                    <li><a href=""><span>微信网页版</span></a></li>
                </ul>
            </div>
            <div class="b1">
               <div class="b2">
                <ul>
                    <li><h1><a href="">微信，是一个生活方式</a></h1></li>
                    <li><h4><a href="">超过十亿人使用的手机应用</a></h4></li>
                    <li><h4><a href="">支持发送语音短信、视频、图片和文字</a></h4></li>
                    <li><h4><a href="">可以群聊，仅耗少量流量，适合大部分智能手机</a></h4></li>
                    <li><img src="images/down.png" alt=""></li>
                    <li class="l1"><a href="">忘记了微信帐号或密码？</a></li>
                    <li class="l1"><a href="">自助解除登录或功能限制</a></li>
                    <li class="l1"><a href="">冻结或解冻微信帐号</a></li>
                </ul>
               </div>
               <div class="b3">
                   <a href="">
                       <img src="images/com.png" alt="">
                   </a>
               </div>
            </div>
        </div>
        <div class="c1">
            <div class="c2">
                <ul>
                    <li>
                        <a href="">
                            <img src="images/list.png" alt="">
                        </a>
                    </li>
                </ul>
                <ul class="u1">
                    <li><h2>微信网页版</h2></li>
                    <li class="z1">扫一扫二维码</li>
                    <li class="z1">就能在浏览器上使用微信</li>
                    <li class="z2"><a href="">了解更多</a></li>
                </ul>
                <ul class="u2">
                    <li><h2>微信 Mac 版</h2></li>
                    <li class="z1">极致简洁，迅捷沟通</li>
                    <li class="z2"><a href="">了解更多</a></li>
                </ul>
                <ul class="u3">
                    <li><h2>微信 Windows 版</h2></li>
                    <li class="z1">让沟通更方便</li>
                    <li class="z2"><a href="">了解更多</a></li>
                </ul>
                <div class="c3">
                    <ul>
                        <li><h4>最新消息</h4></li>
                        <li><a href="">04-22微信 8.0.3 for Android 正式版发布(New)</a></li>
                        <li><a href="">03-29微信 3.0.0 for Mac 正式版发布 (New)</a></li>
                        <li><a href="">03-29微信 8.0.3 for iOS 正式版发布(New)</a></li>
                        <li><a href="">03-22微信 3.2.1 for Windows 正式版发布 (New)</a></li>
                        <li><a href="">01-28关于部分 iOS 9 用户无法更新微信(New)</a></li>
                        <li><a href="">02-11微信外部链接内容管理规范</a></li>
                        <li><a href="">01-17微信网页版 2.1 版本发布</a></li>
                        <li><a href="">07-29微信表情开放平台上线</a></li>
                        <li><a href="">10-28官方辟谣公众号开通</a></li>
                        <li><a href="">查看更多</a></li>
                    </ul>
                </div>
            </div>
        </div>
        <div class="c4">
            <ul class="u5">
                <li class="l4"><a href="">关于腾讯 | </a></li>
                <li class="l4"><a href="">服务条款 | </a></li>
                <li class="l4"><a href="">使用规范 | </a></li>
                <li class="l4"><a href="">使用规范 | </a></li>
                <li class="l4"><a href="">隐私保护指引</a></li>
                <li class="l5"><a href="">© 1998 - 2021 Tencent Inc. All Rights Reserved</a></li>
            </ul>
            <ul class="u4">
                <li class="l3"><a href="">简体中文 |  </a></li>
                <li class="l3"><a href="">繁體中文 |  </a></li>
                <li class="l3"><a href="">English</a></li>
            </ul>



        </div>
    </body>
    </html>